﻿@model NFine.Domain.Entity.SystemManage.UserEntity

@{
    ViewBag.Title = "UserAreas";
}

<link href="~/Content/js/bootstrap/bootstrap.min.css" rel="stylesheet" />
<link href="~/Content/css/framework-theme.css" rel="stylesheet" />
<link href="~/Content/css/framework-font.css" rel="stylesheet" />
<link href="~/Content/css/framework-ui.css" rel="stylesheet" />
<link rel="stylesheet" href="~/Content/js/jOrgChart/jquery.jOrgChart.css" />
<script type='text/javascript' src="~/Content/js/jquery/jquery-2.1.1.min.js"></script>
<script type='text/javascript' src="~/Content/js/jOrgChart/jquery.jOrgChart.js"></script>
<style>
    .divNode,a {
        text-decoration: none;
        color: #fff;
        font-size: 12px;
    }

    .jOrgChart .node {
        width: 100px;
        height: 45px;
        line-height: 20px;
        border-radius: 4px;
        margin: 0 8px;
    }
    .manager {
        background-color: #ded78b;
        border-radius: 4px;
    }
</style>

<script type="text/javascript">
        function search() {
            var newhref = "@Url.Content("~/SystemManage/User/UserAreas/")" + $("#txt_keyword").val();
            $("#searchBtn").attr("href", newhref)
        }

        function onchecked() {
            if ($("#openNewWin").is(':checked'))
                $("#searchBtn").attr("target", "_blank");
            else
                $("#searchBtn").attr("target", "");
        }

</script>

@helper renderUsers(NFine.Domain.Entity.SystemManage.UserEntity user)
{
    string classStr = (user.CurrentManagerType == null || user.CurrentManagerType < 3) ? "" : "manager";
    <li>
        <div class="divNode @classStr" >
            <div><a href="~/SystemManage/User/UserAreas/@user.F_Account" target="_blank" >@user.F_Account</a><span style="color:#09aa0c;margin: 0px 10px;">@user.CumulativePoints</span>
            </div>
            <div>@user.CurrentManager</div>
        </div>
        @if (user.childrens != null && user.childrens.Count > 0)
        {
        <ul>
            @foreach (var item in user.childrens)
            {
                @renderUsers(item);
            }
        </ul>
        }
    </li>
}

<div>
    <div class="search">
        <table>
            <tr>
                <td>
                    <div class="input-group">
                        <input id="txt_keyword" type="text" class="form-control" oninput="search()" placeholder="会员ID" style="width: 200px;">
                        <span class="input-group-btn">
                            <a class="btn btn-primary" id="searchBtn" href="" target=""><span class="glyphicon glyphicon-search"></span></a>
                        </span>
                        <div class="ckbox" style="margin-left:6px;">
                            <input id="openNewWin" name="openNewWin" type="checkbox" onclick="onchecked()"><label for="openNewWin">打开新页面</label>
                        </div>
                    </div>
                </td>
            </tr>
        </table>
    </div>
    <ul id="org" style="display:none;">
        @renderUsers(Model)
    </ul>
    <div id='jOrgChart'></div>
    <script type='text/javascript'>
        $(document).ready(function () {
            $("#org").jOrgChart({
                chartElement: '#jOrgChart',//指定在某个dom生成jorgchart
                dragAndDrop: false //设置是否可拖动
            });
        });
    </script>

</div>
